/* homeSub/pages/siteDetail/siteDetail.wxss */
@import "../../../commin/commin.less";

page {
    background-color: #F5F7FA;
    padding-bottom: 100rpx;
}
// #V2G功能
.diacharge-priceInfo {
    .dis-text1{
        font-family: PingFang SC, PingFang SC;
        font-weight: 400;
        font-size: 28rpx;
        color: #909399;
    }
    .dis-text2{
        font-family: PingFang SC, PingFang SC;
        font-weight: 400;
        font-size: 26rpx;
        color: var(--textColor);

        text {
            font-size: 40rpx
        }
    }
    .dis-text3{
        font-family: PingFang SC, PingFang SC;
        font-weight: 400;
        font-size: 24rpx
    }
}

.sitePage {
    .margins(16rpx, 24rpx, 150rpx, 24rpx);
}

.siteDetail {
    background: linear-gradient(0deg, #FFFFFF, #F4F6F8);
    .borders(2rpx, @white-color);
    box-shadow: 4px 7px 20px 0px rgba(166, 171, 179, 0.24);
    .borderradius(16rpx, 16rpx, 16rpx, 16rpx);
    .kuan(654rpx);
    .paddings(24rpx, 24rpx, 24rpx, 24rpx);

    .title {
        flex-wrap: wrap;
        display: flex;
        flex-direction: row;
        margin-bottom: 20rpx;
        font-weight: bold;
    }

    .tagList {
        display: flex;
        flex-wrap: wrap;

        .tag_item {
            background: rgba(96, 98, 102, 0.06);
            .borderradius(20rpx, 20rpx, 20rpx, 20rpx);
            .fontsize(24rpx);
            font-family: PingFang SC;
            font-weight: 400;
            color: @text-color4;
            padding: 9rpx 18rpx;
            .margins(12rpx, 10rpx, 12rpx, 10rpx);
        }

        .tag_item last {
            margin: 0;
        }
    }

    .siteImg {
        height: 120rpx;
        .margins(18rpx, 0, 31rpx, 0);

        .view_list {
            width: 100%;
            text-align: center;
            display: flex;
        }

        .mypic {
            width: 200rpx;
            height: 120rpx;
            margin-right: 12rpx;
            .borderradius(10rpx, 10rpx, 10rpx, 10rpx);
        }
    }

    .siteTime {
        display: flex;
        align-items: center;
		display: inline-block;
        .img {
            .kuangao(31rpx, 30rpx);
            margin-right: 9rpx
        }

        .fontsize(24rpx);
        font-family: PingFang SC;
        font-weight: 500;
        color: @text-color3;
    }

    .info {
        display: flex;
        justify-content: space-between;
        margin-top: 27rpx;

        .address {
            .kuan(75%);
            .fontsize(24rpx);
            align-items: center;
            font-family: PingFang SC;
            font-weight: 500;
            color: @text-color3;

            .img {
                .kuangao(23rpx, 30rpx);
                margin-right: 12rpx;
                float: left;
            }
        }

        .item {
            .fontsize(24rpx);
            font-family: PingFang SC;
            font-weight: 500;
            color: @blue;

            .img {
                .kuangao(27rpx, 25rpx);
            }
        }
    }
	.notice {
	        display: flex;
	        background: #F5F7FA;
	        .fontsize(24rpx);
	        .paddings(30rpx, 24rpx, 16rpx, 24rpx);
	        font-family: PingFang SC;
	        font-weight: 500;
	        color: @text-color4;
	        line-height: 36rpx;
	        margin-top: 31rpx;

	        .img {
	            .kuangao(29rpx, 20rpx);
	        }

	        .scrollIsf {
	            margin-top: -8rpx;
	            margin-left: 16rpx;
	        }
	    }
	.timeListCon{
		font-size: 24rpx;
		align-items: center;
		font-family: PingFang SC;
		font-weight: 500;
		color: #606266;
		margin-top: 25rpx;
		.timeListText{
			margin-left: 10rpx;
		}
		.img {
		    .kuangao(31rpx, 30rpx);
		    margin-right: 9rpx;
			vertical-align: middle;
		}
	}


	.showTime{
		padding: 9rpx 16rpx 8rpx 17rpx;
		display: inline-block;
		text-align: center;
		border: 1rpx solid @blue;
		border-radius: 8rpx;
		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: @blue;
		margin-right: 8rpx;
	}
	.tagList{
			  display: inline-block;
              line-height: 50rpx;
              .tagCon{
                display: inline;
              }
              .tagDivision{
                display: inline;
                position: relative;
                
                &::after {
                    position: absolute;
                    right: 0;
                    top: 15rpx;
                    content: '';
                    height: 22rpx;
                    width: 1px;
                    background: #909399;
                }
              }
			  .tag {
                font-size: 24rpx;
                font-family: PingFang SC;
                font-weight: 500;
                padding: 6rpx 16rpx;
                &.tag1 {
                    border: 1px solid @blue;
                    border-radius: 8rpx;
                    color: @blue;
                    margin: 0 4rpx;
                    
                }
                &.tag2 {
                    color: #909399;
                    position: relative;

                    // &::after {
                    //     position: absolute;
                    //     right: 0;
                    //     top: 12rpx;
                    //     content: '';
                    //     height: 22rpx;
                    //     width: 1px;
                    //     background: #909399;
                    // }
                    // &:last-child {
                        
                    //     &::after {
                    //         width: 0;
                    //     }
                    // }
                }
            }
            
	}

}

.sitePrice {
    background: linear-gradient(0deg, #FFFFFF, #F4F6F8);
    .borders(2rpx, @white-color);
    box-shadow: 4px 7px 20px 0px rgba(166, 171, 179, 0.24);
    .borderradius(16rpx, 16rpx, 16rpx, 16rpx);
    .kuan(654rpx);
    .paddings(24rpx, 24rpx, 0rpx, 24rpx);
    margin: 16rpx 0;

    .priceInfo {
        display: flex;
        justify-content: space-between;
        margin-bottom: 40rpx;
        .fontsize(34rpx);
        font-family: PingFang SC;
        font-weight: bold;
        color: @text-color2;

        .txt {
            display: flex;
            align-items: center;
            .fontsize(28rpx);
            font-family: PingFang SC;
            font-weight: 500;
            color: @blue;

            .txtImg {
                .kuangao(16rpx, 27rpx);
                margin-left: 17rpx;
            }
            .txticon {
                margin-left: 4rpx;
                line-height: 1;
            }
        }
    }

    .exceed {
        position: relative;
        background: rgba(20, 135, 250, 0.08);
        .paddings(38rpx, 30rpx, 38rpx, 30rpx);
        margin-bottom: 16rpx;

        .txt1 {
            .fontsize(24rpx);
            font-family: PingFang SC;
            font-weight: 500;
            color: @blue;
        }
    }

    .img {
        .kuangao(51rpx, 40rpx);
        margin-right: 14rpx;
    }

    .one {
        display: flex;
        align-items: center;
        letter-spacing: 3rpx
    }

    .txt2 {
        .fontsize(24rpx);
        font-family: PingFang SC;
        font-weight: 500;
        color: @text-color4;
    }

    .txt3 {
        .fontsize(30rpx);
        font-family: PingFang SC;
        font-weight: bold;
        color: @text-color2;
    }

    .txt4 {
        .fontsize(40rpx);
        font-family: DIN;
        font-weight: bold;
        color: var(--textColor);
        display: flex;
        align-items: baseline;
        margin-left: 32rpx;
    }

    .txt5 {
        .fontsize(30rpx);
        font-family: MyriadPro-Regular;
        font-weight: Regular;
        color: var(--textColor);
    }

    .disFlex {
        display: flex;
        justify-content: space-between;
    }

    .fast {
        position: relative;
        background: rgba(252, 140, 110, 0.08);
        .paddings(38rpx, 30rpx, 38rpx, 30rpx);
        margin-bottom: 16rpx;

        .txt1 {
            .fontsize(24rpx);
            font-family: PingFang SC;
            font-weight: 500;
            color: @orange;
        }
    }

    .slow {
        position: relative;
        background: rgba(148, 213, 104, 0.08);
        .paddings(38rpx, 30rpx, 38rpx, 30rpx);

        .txt1 {
            .fontsize(24rpx);
            font-family: PingFang SC;
            font-weight: 500;
            color: @green;
        }
    }
    .price-btn {
        position: absolute;
        top: 98rpx;
        right: 30rpx;
        .fontsize(24rpx);
        font-family: PingFang SC;
        font-weight: 500;
        color: @blue;
    }
    // #V2G功能
    .dischargeItem {
        position: relative;
        background: rgba(252, 140, 110, 0.08);
        .paddings(38rpx, 30rpx, 38rpx, 30rpx);
        margin-bottom: 16rpx;

        .txt1 {
            .fontsize(24rpx);
            font-family: PingFang SC;
            font-weight: 500;
        }
    }
}

.fotInfo {
    background: linear-gradient(0deg, #FFFFFF, #F4F6F8);
    .borders(2rpx, @white-color);
    box-shadow: 4px 7px 20px 0px rgba(166, 171, 179, 0.24);
    .borderradius(16rpx, 16rpx, 16rpx, 16rpx);
    .kuan(654rpx);
    .paddings(24rpx, 24rpx, 40rpx, 24rpx);
    .margins(16rpx, 0, 40rpx, 0);

    .txt1 {
        .fontsize(34rpx);
        font-family: PingFang SC;
        font-weight: bold;
        color: @text-color2;
        padding-bottom: 32rpx;
        border-bottom: 1rpx solid #DCDFE6;
    }

    .txt2 {
        display: flex;
        .fontsize(30rpx);
        font-family: PingFang SC;
        font-weight: bold;
        color: @text-color1;
        margin-top: 40rpx;

        .type {
            .fontsize(30rpx);
            font-family: PingFang SC;
            font-weight: 500;
            color: @text-color3;
            margin-left: 71rpx;
        }
    }

    .txt3 {
        display: flex;
        margin-top: 40rpx;
        .fontsize(30rpx);
        font-family: PingFang SC;
        font-weight: bold;
        color: @text-color1;

        .num {
            .fontsize(30rpx);
            font-family: PingFang SC;
            font-weight: 500;
            color: @blue;
            margin-left: 71rpx;
        }
    }

}

.fot-do {
    width: 698rpx;
    position: fixed;
    bottom: 0;
    background: linear-gradient(0deg, #FFFFFF, #F4F6F8);
    border: 2rpx solid rgba(255, 255, 255, 0.55);
    box-shadow: 0rpx -25rpx 67rpx 0rpx rgba(177, 182, 190, 0.2);
    .paddings(10rpx, 31rpx, 10rpx, 31rpx);

    .mode {
        margin-top: 11rpx;
        text-align: center;
        flex: 1;
        margin-right: 30rpx;
        font-size: 24rpx;
        font-weight: 500;
        color: #606266;
    }

    .disFlex {
        display: flex;
        justify-content: space-between;
    }

    .img {
        .kuangao(33rpx, 31rpx)
    }

    .scanBtn {
        flex: 4;
        text-align: center;
        background: var(--btnColor);
        box-shadow: 0rpx 3rpx 6rpx 0rpx rgba(0, 110, 212, 0.3);
        .borderradius(44rpx, 44rpx, 44rpx, 44rpx);
        .fontsize(34rpx);
        font-family: PingFang SC;
        font-weight: 500;
        color: @white-color;
        .lineheight(88rpx);
    }

    .scanBtn1 {
        flex: 4;
        text-align: center;
        background: #909399;
        border-radius: 44rpx 44rpx 44rpx 44rpx;
        font-size: 34rpx;
        font-family: PingFang SC;
        font-weight: 500;
        color: #fff;
        line-height: 88rpx;
    }
}

.explain {
    .margins(40rpx, 0, 40rpx, 0);

    .txt1 {
        .fontsize(30rpx);
        font-family: PingFang SC;
        font-weight: bold;
        color: @text-color2;
        margin-bottom: 25rpx;
    }

    .txt2 {
        .fontsize(24rpx);
        font-family: PingFang SC;
        font-weight: 500;
        color: @text-color4;
    }

    .disFlex {
        display: flex;
        justify-content: space-between;
        .fontsize(24rpx);
        font-family: PingFang SC;
        font-weight: 500;
        color: @blue;

        .explainImg {
            .kuangao(16rpx, 27rpx);
        }
        .explainIcon {
            line-height: 1;
        }
    }
}

.explain2 {
    border-top: 1rpx solid @text-color5;
    padding-bottom: 40rpx;

    .txt1 {
        .fontsize(30rpx);
        font-family: PingFang SC;
        font-weight: bold;
        color: @text-color2;
        margin: 40rpx 0rpx 25rpx 0rpx;
    }

    .txt2 {
        .fontsize(24rpx);
        font-family: PingFang SC;
        font-weight: 500;
        .margins(25rpx, 0, 4rpx, 0);
        color: @text-color4;
    }

    .disFlex {
        display: flex;
        justify-content: space-between;
        .fontsize(24rpx);
        font-family: PingFang SC;
        font-weight: 500;
        margin-top: 23rpx;
        color: @text-color4;

        .money {
            color: @text-color3;
        }
    }
}

.user-content-view {
    overflow: hidden;
    text-overflow: ellipsis;
    text-overflow: -o-ellipsis-lastline;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;

}

.user-content {
    font-size: 24rpx;
    font-family: PingFang SC;
    font-weight: 500;
    color: #909399;
    line-height: 36rpx
}

/* 展开 收起 */
.state {
    text-align: left;
    .margins(30rpx, 0, 10rpx, 0rpx);
    .fontsize(22rpx);
    font-family: PingFang SC;
    font-weight: 500;
    color: @blue;
}

.hide {
    display: -webkit-box;
}

.show {
    display: block
}

.mask {
    .kuangao(100%, 100vh);
    background-color: rgba(56, 55, 55, 0.651);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 900;
}

.windows {
    .kuangao(590rpx, 400rpx);
    .flexs();
    background-color: @white-color;
    .borderradius(16rpx, 16rpx, 16rpx, 16rpx);
    position: fixed;
    left: 11%;
    top: 35%;
    z-index: 999;

    .tips {
        .fontsize(34rpx);
        font-family: PingFang SC;
        font-weight: 500;
        color: @text-color1;
        margin-bottom: 119rpx;
    }

    .btn {
        display: flex;

        .Button1 {
            .kuangao(220rpx, 88rpx);
            .lineheight(80rpx);
            .borders(1rpx, @text-color4);
            .borderradius(44rpx, 44rpx, 44rpx, 44rpx);
            background-color: @white-color;
            margin-right: 30rpx;
        }

        .word1 {
            .fontsize(30rpx);
            font-family: PingFang SC;
            font-weight: bold;
            color: @text-color4;
        }

        .Button2 {
            .kuangao(220rpx, 88rpx);
            .lineheight(80rpx);
            .borderradius(44rpx, 44rpx, 44rpx, 44rpx);
            // background: linear-gradient(105deg, #2B99FF, #1B8CF5);
            background: var(--btnColor);
            box-shadow: 0rpx 3rpx 6rpx 0rpx rgba(0, 110, 212, 0.3);
        }

        .word2 {
            .fontsize(30rpx);
            font-family: PingFang SC;
            font-weight: bold;
            color: @white-color;
        }
    }
}

.dataInfo {
    .fontsize(34rpx);
    .lineheight(70rpx);
    font-family: PingFang SC;
    font-weight: 500;
    color: @text-color1;
    text-align: center;
}

.customerBtn {
    display: flex;
    margin-top: 100rpx;
    justify-content: space-between;

    .btn1 {
        .kuangao(220rpx, 88rpx);
        .lineheight(88rpx);
        .borders(1rpx, @text-color4);
        border-radius: 44rpx;
        text-align: center;
        .fontsize(30rpx);
        font-family: PingFang SC;
        font-weight: bold;
        color: @text-color4;
    }

    .btn2 {
        .kuangao(220rpx, 88rpx);
        .lineheight(88rpx);
        background: linear-gradient(105deg, #2B99FF, #1B8CF5);
        box-shadow: 0rpx 3rpx 6rpx 0rpx rgba(0, 110, 212, 0.3);
        border-radius: 44rpx;
        text-align: center;
        .fontsize(30rpx);
        font-family: PingFang SC;
        font-weight: bold;
        color: @white-color;
    }
}

.originalPrice {
    margin-left: 12rpx;
    font-size: 22rpx;
    font-family: PingFang SC;
    font-weight: 400;
    text-decoration: line-through;
    color: #909399;
}

.infoPopup{
    .fontsize(30rpx);
    .lineheight(70rpx);
  font-family: PingFang SC;
  color: @text-color1;
  display: block;
  font-size: 30rpx;
  .infoTitle{
    display: inline-block;
    width: 5em;
    text-align: right;
  }
  .infoValue{
    color: @blue;
  }
  }

.disFlex1 {
    display: flex;
    align-items: baseline;
}
.yuan {
    color: var(--textColor);
    font-size: 26rpx;
}
.uni-button-color {
    color: var(--textColor) !important;
}

.box-info{
    width: 680rpx;
    height: 660rpx;
    padding: 40rpx 32rpx;
    margin: 0 auto;
    overflow: auto;
    padding-top: 0;
    .title{
        font-size: 30rpx;
        font-weight: bold;
        color: #303133;
        position: fixed;
        z-index: 10;
        background-color: #fff;
        width: 93%;
        height: 100rpx;
        line-height: 100rpx;
        &:after{
            content: '';
            display: block;
            position: absolute;
            top: 36rpx;
            left: -15rpx;
            width: 6rpx;
            height: 30rpx;
            background-color: #6DB12E;
            z-index: 2;
        }
    }
    &>.t1{
        display: flex;
        justify-content: space-between;
        font-size: 26rpx;
        font-family: PingFang SC;
        font-weight: 500;
        color: #303133;
        margin-bottom: 24rpx;
        margin-top: 32rpx;
        padding-top: 80rpx;
    }
}
